This sample will give you a step by step tutorial on binding a datasource to a grid grouping control. This involves two major tasks. The first task is to place the GridGroupingGrid on the form. The second task is to use the designer to set up databinding to an Access data file.
Open the Data section of your toolbox and drag an OleDbDataAdapter onto your form. This will open the Data Adapter Wizard.
DataBinding
We will use the wizard to create a connection to the Northwind.mdb file. Click next to. The following screen will be displayed.
Setting up the Data Connection
Click the New Connection button. The following screen will be displayed. On this screen select The Microsoft Jet 4.0 provider.
Choose the Access Data Provider, Jet 4.0
Clicking Next will display the Data Link Properties screen which, is shown below.
Click the Browse button to select the file
Click the Browse button that is next to the database name entry box, to browse and locate the mdb file. The file is found under the Windows\Data folder in your Syncfusion installation folder.
Locating the Access file, Northwind.mdb
After you open the Northwind.mdb file, you will again see the Choose Your Data Connection screen but, this time it will display the Datasource as the mdb file.
Setting the mdb file as the Data Connection
Click Next on the Data Connection screen to display the Query Type screen and select to use SQL statements.
Select to Use SQL Statements
To generate the SQL statement, click the Query Builder button.
Select the Query Builder
In the Add Table dialog, select the Suppliers table and click Add, then Close.
Select the Suppliers Table
In this Query Builder window, select All Columns. Then press OK.
Select the Fields for Your Query
Click Next to confirm the Query that you have selected.
Confirm the Query
Click Finish. Your design surface will look similar to this.
Adapter and Connection
Next you will need to generate a dataset from the OleDbDataAdapter. Right-click the oleDbDataAdapter1 under the design surface and select Generate DataSet. You will then see this window.
Generating a Dataset
Press OK to add a DataSet11 object next to the oleDbConnection1 under the design surface.
From the toolbox, drag the GridGroupingControl control to your form. Size and position it. Also, set the DataSource property to dataSet11.Suppliers DataTable as shown in the image below.
Designer with GridGroupingControl and setting the DataSource property
Double click the form on the design surface (not one of the controls but, the form itself) to add a load event handler. In this handler, add this single statement as given below. This statement tells the adapter to load the data from the DataTable. Without this statement, you will see an empty GridGroupingControl at runtime.
this.oleDbDataAdapter1.Fill(this.dataSet11);
Finally, use the GridGroupingControl PropertyGrid as shown to set the Anchor properties to all sides, so that the GridGroupingControl can be easily sized with the form. This is depicted in the image given below.
Setting Anchor Property
To allow grouping at runtime, the GridGroupingControl displays a drop panel onto to which the user can drag columns and drop them to group by the dragged column. To display this drop panel, you need to set the ShowGroupDropArea property as shown in the window below.
Adding the Group Drop Area
Run the project. You will see the basic GridGroupingControl with the data as shown below.
GridGroupingControl
To group by CompanyName, mousedown on the CompanyName column header and drag it to the drop area as illustrated in the image given below.
Grouping by CompanyName
Given below is a screen shot after the grouping. Notice that each set of grouped values has its own Caption row and its own AddNew row. Each group has its own PlusMinus cell that will let you expand / collapse the group.
Grouped Grid